<template>
  <div class="page-container ">
    <ex_header_spiler :title="$tt('label_base_info')" />
    <ex_super_desc v-bind="baseOption" :data="form" :attrs="$defaultDetailDescAttrs" />
    <ex_header_spiler :title="$tt('label_sku_specification')" />
    <ex_super_table v-bind="detailOption" :data="form.wavePlanDetailDTOList" size="default" height="400">
    </ex_super_table>
  </div>
</template>

<script>
import router_params from '@/mixin/router_params';

export default {
  name: 'label_wave_plan_detail',
  components: {},
  mixins: [router_params],
  data() {
    return {

      loading: false,
      form: {},
      baseOption: {
        model: [
          { key: 'waveNo', label: 'label_wave_code' },
          { key: 'outOrderType', label: 'label_outbound_status', formatter: (r, c, v) => this.$enumShow(v, "OutboundOrderTypeEnum") },
          { key: 'waveStatus', label: 'label_wave_status', formatter: (r, c, v) => this.$enumShow(v, "WavePlanStatusEnum") },
          { key: 'warehouseCode', label: 'label_outbound_warehouse' },
          { key: 'orderCount', label: 'label_order_count' },
          { key: 'packageCount', label: 'label_package_number' },
          { key: 'logisticsCode', label: 'label_logistics' },
          { key: 'skuCategoryCount', label: 'label_sku_categ_count', },
          { key: 'skuTotalPiece', label: 'label_sku_total_count', },

          { key: 'printNumber', label: 'label_print_count', },

          {
            key: 'waveRule', label: 'label_wave_rule',
            formatter: (r, c, v) => v ? v.split(',').map(it => this.$enumShow(it, "WavePlanRuleEnum")).join(',') : ''
          },

        ],
      },
      detailOption: {
        model: [
          {
            key: 'outOrderNo', label: 'label_outbound_code', 'min-width': 160,
            propertyFilter: true, sortable: true,
          },
          {
            key: 'boxNo', label: 'label_box_code', 'min-width': 150, if: () => !this.SkuOutbound,
            propertyFilter: true, sortable: true,
            render: (h, { row, column }) => {

              const code = row[column.property]
              if (!code) return this.$tt('data_temp_none')
              return (<text_extra_tooltip_operate
                value={code}
                data_type={column.property} data_id={row.id}
                extra_barcode_image={true} extra_text_align='center'
              />)
            },
          },
          {
            key: "skuBarcode", label: "label_sku_code", 'min-width': 140,
            propertyFilter: true, sortable: true,
            render: (h, { row, column }) => {

              if (row.skuId < 0) return '——'

              const code = row[column.property]
              if (!code) return this.$tt('data_temp_none')
              return (<text_extra_tooltip_operate
                value={code}
                data_type={column.property} data_id={row.id}
                extra_barcode_image={true} extra_text_align='center'
              />)
            },
          },
          {
            key: "skuOnlyCode", label: "label_sku_only_code", 'min-width': 140,
            propertyFilter: true, sortable: true,
            render: (h, { row, column }) => {
              if (row.skuId < 0) return '——'
              const code = row[column.property]
              if (!code) return this.$tt('data_temp_none')
              return (<text_extra_tooltip_operate
                value={code}
                data_type={column.property} data_id={row.id}
                extra_barcode_image={true} extra_text_align='center'
              />)
            },
          },
          {
            key: 'skuNameCn', label: 'label_sku_name', 'min-width': 140, 'show-overflow-tooltip': true,
            formatter: (r, c, v) => (r.skuId < 0) ? '——' : this.$formatNameCode(v, r.skuNameEn)
          },
          { key: 'customerName', label: 'label_customer_info', 'width': 120, 'show-overflow-tooltip': true, },
        ],
      },
    }
  },
  computed: {

    SkuOutbound() {
      return !(this.form.wavePlanDetailDTOList && this.form.wavePlanDetailDTOList.some(it => it.boxNo))
    },

  },
  methods: {
    init_data_default(into_params) {
      if (into_params.id) {
        this.loading = true
        this.$ajax({
          url: "/wms-api/outbound/OutboundWavePlanRpc/detail.json",
          method: 'post',
          data: { id: into_params.id },
          success: (res) => {
            this.form = Object.assign({}, res.data)
            this.fixTabLabel()
          },
          complete: () => {
            this.loading = false
          }
        })
      }
      this.fixTabLabel()
    },
    fixTabLabel() {
      if (!!this.form.waveNo) {
        this.$emit("tagModifyLabel", {
          _key: 'label_name_code', i18n: { name: true, },
          name: "label_wave_plan_detail",
          code: this.form.waveNo || ''
        })
      } else {
        this.$emit("tagModifyLabel", "label_wave_plan_detail")
      }
    },

  }
}
</script>
